import React, { useEffect, useState } from 'react';
import FormRender, { useForm } from 'form-render';
import { getStartFormData } from '../../services/todoTask';
import { flowableToFormEngine } from '../../utils/formSchemaTransform';

const ApplicationForm = ({ itemInfo }: { itemInfo: any }) => {
  // 绑定渲染表单
  const renderForm = useForm();
  // 动态表单
  const [formSchema, setFormSchema] = useState<{} | null>({});

  useEffect(() => {
    init();
  });

  const init = async () => {
    let res = await getStartFormData({
      processInstanceId: itemInfo.processInstanceId,
    });
    console.log(res);
    // 有表单则渲染表单
    if (res.data != '') {
      let obj = flowableToFormEngine(res.data);
      setFormSchema(obj);
    } else {
      setFormSchema(null);
    }
  };

  return (
    <div>
      {formSchema ? <FormRender form={renderForm} schema={formSchema} /> : null}
    </div>
  );
};

export default ApplicationForm;
